$(function () {
    $(document).ready(function () {
        $("body").hide().fadeIn(1000);
        $('img.lazy').lazyload({
            //图片显示时淡入效果
            effect: "fadeIn",
            //没有加载图片时的临时占位符
            placeholder: "/static/image/lazy.png",
            //图片在距离屏幕 200 像素时提前加载.
            threshold: 200,
            //将图片加载放进click事件中（不常用）
            event: "scroll",
            //加载隐藏的图片（不常用）
            skip_invisible: false
            //其他配置项请查看官网
        });
    })
    //TODO 完成网站首页炫酷的特效叭！
    /*--------------------------------------login start------------------------------------------------*/
    /*页面加载淡入淡出效果*/
    /*关于我们*/
    $("#more").click(function () {
        $("#content_son").slideUp("slow");
        $("#control_back").addClass("dim");
        $("#indexFooter>div").addClass("dim");
    })
    /*回到顶部*/
    $("#control_top").click(function () {
        $("#content_son").slideDown("slow");
        $("html,body").scrollTop(0);
    })
    //监听网页的滚动
    $(window).scroll(function () {
        // console.log($("html,body").scrollTop());
        var offset = $("html,body").scrollTop();
        //判断网页是否移动到了位置
        if(offset === 0) {
            $("#control_back").removeClass("dim");
            $("#indexFooter>div").removeClass("dim");
            $("#content_son").slideDown("slow");
            $("#control_top").fadeOut();
        }else if(offset >= 10){
            $("#control_back").addClass("dim");
            $("#indexFooter>div").addClass("dim");
            $("#content_son").slideUp("slow");
            $("#control_top").fadeIn();
        }
        // console.log("网页滚动了");
    })



    /*--------------------------------------login end------------------------------------------------*/

    /*--------------------------------------register start------------------------------------------------*/

    /*--------------------------------------register end------------------------------------------------*/



    /*手势*/
// 开始按下手机的起点坐标
    var startPoint = null;
    var indexPage = 0;   document.addEventListener("touchstart",function(e){
        var e = e||window.event;
        startPoint = e.touches[0];
    })
    document.addEventListener("touchend",function(e){
        var e=e||window.event;
        //e.changedTouches能找到离开手机的手指，返回的是一个数组
        var endPoint = e.changedTouches[0];
        //计算终点与起点的差值
        var x = endPoint.clientX - startPoint.clientX;
        var y = endPoint.clientY - startPoint.clientY;
        //设置滑动距离的参考值
        var d = 100;
        if(Math.abs(x)>d){
            if(x>0){
                console.log("向右滑动");
                window.location="/login/0";
            }else{
                console.log("向左滑动");
                window.location="/login/0";
            }
        }
        if(Math.abs(y)>d){
            if(y>0){
                console.log("向下滑动");
            }else{
                console.log("向上滑动");
            }
        }
    })
    /*手势 end*/


    /*----动画与点击事件----*/
    $("#changeImage").mouseenter(function () {
            $(this).addClass("change_image");
    }).mouseleave(function () {
        $(this).removeClass("change_image");
    })

    $(".select_it").mouseenter(function () {
        $(this).addClass("img_select");
    }).mouseleave(function () {
        $(this).removeClass("img_select");
    })

    /*左右切换*/
    function changeImageClass(className){
        $(className).mouseenter(function () {
            $(this).addClass("img_change_select");
        }).mouseleave(function () {
            $(this).removeClass("img_change_select");
        })
    }
    changeImageClass("#leftChange")
    changeImageClass("#rightChange")



    var left = 0;
    var timer;
    function autoPlay(){
        timer = setInterval(function () {
            left+=1;
            if(left >= 50){
                left = 0;
                $("#startUseImg").animate({"left": left},200,"swing");
            }
            $("#startUseImg").css("left", left);
        },30);
    }


    $("#startUse").hover(function () {
        //停止滚动
        autoPlay();
    },function () {
        //开始滚动
        $("#startUseImg").animate({"left": 0},200,"swing");
        clearInterval(timer);
    })


    $("#header").mouseenter(function () {
        $("#header nav").addClass("navbar-inverse")
        $("nav a").css("color","white")
        $("nav ul").css("background","black")
    }).mouseleave(function () {
        $("#header nav").removeClass("navbar-inverse")
        $("nav a").css("color","black")
        $("nav ul").css("background","")
    })

})